<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>使用教程</title>

  <!-- Bootstrap -->
  <link href="/static/bootstrap-3.3.4/dist/css/bootstrap.min.css" rel="stylesheet">

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body>
<style type="text/css">
  .rowTitle{
    line-height: 30px;
  }
</style>
  <h3 class="text-center bg-success" style="line-height: 40px">使用教程</h3>

  <div class="container">
    <div class="row">
    <h4 class="text-center bg-primary rowTitle"> 后台PHP模块使用 </h4>
      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">交流QQ群</h3>
          </div>
          <div class="panel-body">QQ群1  ：   241950434</div>
        </div>
      </div>

      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">Menu 使用DEMO</h3>
          </div>
          <div class="panel-body">
            <a href="{:url('menu_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
    <h4 class="text-center bg-primary rowTitle"> 前端插件使用案例 </h4>
      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">datatimePiker  DEMO</h3>
          </div>
          <div class="panel-body">
            <p>日期，时间插件</p>
              <a href="{:url('datetimepiker_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>


      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">ajaxFileUpload  DEMO</h3>
          </div>
          <div class="panel-body">
            <p>ajax上传图片</p>
            <a href="{:url('ajaxfileupload_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>

      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">UMeditor  DEMO</h3>
          </div>
          <div class="panel-body">
            <p>百度 UMeditor</p>
            <a href="{:url('umeditor_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">ajaxSubmit和validation  DEMO</h3>
          </div>
          <div class="panel-body">
            <p>validation表单验证 ajax提交表单 artDialog友好提示框</p>
            <a href="{:url('ajaxsubmit_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>
      
      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">Web Uploader</h3>
          </div>
          <div class="panel-body">
            <p>Web Uploader文件上传组件, 上传文件这个确实不错，可以做首选</p>
            <a href="{:url('web_uploader_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>

      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">综合使用案例</h3>
          </div>
          <div class="panel-body">
            <p>所有插件聚合一起</p>
            <a href="{:url('multiple_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>

    </div>
    <div class="row">
      <div class="col-lg-4">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">HTML5 图片预览+base64图片上传</h3>
          </div>
          <div class="panel-body">
            <p>HTML5图片预览，base64图片上传，APP端base64图片接收</p>
            <a href="{:url('base64_demo')}">查看 DEMO</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
</html>